<template>
    <svg
        :class="['icon', name]"
        :width="width"
        :height="height"
        :style="{fill, ...style}"
        t="1725724226475"
        class="icon"
        viewBox="0 0 1024 1024"
        version="1.1"
        xmlns="http://www.w3.org/2000/svg"
        p-id="10671"
    >
        <path
            d="M912 208H427.872l-50.368-94.176A63.936 63.936 0 0 0 321.056 80H112c-35.296 0-64 28.704-64 64v736c0 35.296 28.704 64 64 64h800c35.296 0 64-28.704 64-64v-608c0-35.296-28.704-64-64-64z m-800-64h209.056l68.448 128H912v97.984c-0.416 0-0.8-0.128-1.216-0.128H113.248c-0.416 0-0.8 0.128-1.248 0.128V144z m0 736v-96l1.248-350.144 798.752 1.216V784h0.064v96H112z"
            fill="#222"
            p-id="10672"
        ></path>
    </svg>
</template>

<script setup lang="ts">
const {name, width, height, fill, style} = defineProps({
    name: String,
    width: {type: Number, default: 18},
    height: {type: Number, default: 18},
    fill: {type: String, default: "#222"},
    style: {type: Object, default: () => ({})},
});
</script>

<style scoped lang="less">
.icon {
    display: flex;
    justify-content: center;
    align-items: center;
}
</style>
